﻿<div id="myTab">
    <!-- 导航 -->
    <ul>
        <li class="active">
            <a href="#baseProp" data-toggle="tab">属性</a>
        </li>
        <li>
            <a href="#eventProp" data-toggle="tab">事件</a>
        </li>
    </ul>
    <!-- 内容 -->
    <form class="form-inline" role="form">
        <div id="baseProp">
            <div class="form-group">
                <label for="txtEName">英文名称：</label><input type="text" class="form-control" readonly="readonly" id="txtEName" />
            </div>
            <div class="form-group">
                <label for="txtCName">显示文本：</label><input type="text" class="form-control" id="txtCName" />
            </div>
            <div class="form-group">
                <label for="txtCName">选择样式：</label>
                <select id="selClass">
                    <option title="表示一个成功的或积极的动作，绿色背景" value="btn btn-success">成功按钮</option>
                    <option title="标准的按钮,白色背景" value="btn btn-default">默认按钮</option>
                    <option title="提供额外的视觉效果，标识一组按钮中的原始动作，亮蓝色背景" value="btn btn-primary">原始按钮</option>
                    <option title="信息警告消息的上下文按钮，淡蓝色背景" value="btn btn-info">信息按钮</option>
                    <option title="表示应谨慎采取的动作，橙色背景" value="btn btn-warning">警告按钮</option>
                    <option title="表示一个危险的或潜在的负面动作，红色背景" value="btn btn-danger">危险按钮</option>
                    <option title="并不强调是一个按钮，看起来像一个链接，但同时保持按钮的行为" value="btn btn-link">链接按钮</option>
                </select>
            </div>
            <div class="form-group">
                <label for="txtCName">选择大小：</label>
                <select id="selSize">
                    <option value="btn-large">较大</option>
                    <option value="btn-default">默认</option>
                    <option value="btn-small">较小</option>
                    <option value="btn-mini">很小</option>
                </select>

            </div>
        </div>
        <div id="eventProp">
            <div class="form-group">
                <label for="txtClickEvent">单击：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtClickEvent" />
                <button type="button" class="btn btn-primary" onclick="btnClickEventConfig();">配置</button>
            </div>
            <div class="form-group">
                <label for="txtDBLClickEvent">双击：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtDBLClickEvent" />
                <button type="button" class="btn btn-primary" id="btnDBLClickEvent">配置</button>
            </div>
            <div class="form-group">
                <label for="txtEnterEvent">进入：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtEnterEvent" />
                <button type="button" class="btn btn-primary" id="btnEnterEvent">配置</button>
            </div>
            <div class="form-group">
                <label for="txtBlurEvent">离开：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtBlurEvent" />
                <button type="button" class="btn btn-primary" id="btnBlurEvent">配置</button>
            </div>
            <div class="form-group">
                <label for="txtKeyUpEvent">按键：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtKeyUpEvent" />
                <button type="button" class="btn btn-primary" id="btnKeyUpEvent">配置</button>
            </div>
        </div>
    </form>
</div>
